<script setup lang="ts">
//相关 BIOS 快捷方式
import BiosData from "@/data/page/page/bios";
</script>
<template>
  <ul class="text-sm ul-type py-6">
    <li class="mt-2" v-for="(item, index) in BiosData">
      <a :href="`#${index}`" :aria-label="'跳转至' + item.title">{{
        item.title
      }}</a>
    </li>
  </ul>
  <div v-for="(item, index) in BiosData">
    <h2 :id="index.toString()" class="text-2xl leading-tight py-4 mt-4">
      {{ item.title }}
    </h2>

    <table class="border w-full text-center">
      <thead>
        <tr>
          <th class="border p-4 whitespace-nowrap font-bold text-xl">品牌</th>
          <th class="border p-4 whitespace-nowrap font-bold text-xl">BIOS</th>
          <th class="border p-4 whitespace-nowrap font-bold text-xl">启动项</th>
        </tr>
      </thead>
      <tbody>
        <tr v-for="items in item.data">
          <td class="border p-4">{{ items.brand }}</td>
          <td class="border p-4">{{ items.bios }}</td>
          <td class="border p-4">{{ items.firing }}</td>
        </tr>
      </tbody>
    </table>
  </div>
</template>
<style scoped></style>
